@name yt {
  @b slider-right {
    @e enter {
      opacity: 0.1;
      transform: translate3d(10%, 0, 0);
    }

    @e leave-active {
      transform: translate3d(0%, 0, 0);
    }
  }

  @b slider-left {
    @e enter {
      opacity: 0.1;
      transform: translate3d(-10%, 0, 0);
    }

    @e leave-active {
      transform: translate3d(0, 0, 0);
    }
  }

  @b slider-bottom {
    @e enter {
      transform: translate3d(0, 100%, 0);
    }
    @e leave-active {
      transform: translate3d(0, 100%, 0);
    }
  }

  @b slider-top {
    @e enter {
      transform: translate3d(0, -100%, 0);
    }
    @e leave-active {
      transform: translate3d(0, -100%, 0);
    }
  }

  @b fade {
    @e enter, leave-active {
      opacity: 0;
    }
  }

  @b zoom {
    @e enter, leave-active {
      opacity: 0;
      transform: scale(1.1);
    }
  }

  @b module {
    @e enter, leave-active {
      opacity: 0.1;
      transform: translate3d(10%, 0, 0);
    }
  }
}

@name yt {
  @b ripple-fade {
    @e enter {
      transform: scale(0);
    }
    @e leave-active {
      opacity: 0 !important;
    }
  }
}

@name yt {
  @b count-anim {
    @e enter, leave-active {
      opacity: 0.1;
      left: 100% !important;
      transform: translate3d(-100%, -50%, 0) rotate(180deg) !important;
    }
  }
}

@name yt {
  @b input-scale {
    @e enter, leave-active {
      opacity: 0;
      transform: scaleX(0);
    }
  }
}

@name yt {
  @b popup-bottom {
    @e enter, leave-active {
      transform: translate3d(0, 100%, 0);
    }
  }

  @b popup-right {
    @e enter, leave-active {
      transform: translate3d(100%, 0, 0);
    }
  }

  @b popup-top {
    @e enter, leave-active {
      transform: translate3d(0, -100%, 0);
    }
  }

  @b popup-left {
    @e enter, leave-active {
      transform: translate3d(-100%, 0, 0);
    }
  }

  @b popup-center {
    @e enter {
      opacity: 0;
      transform: translate3d(-50%, -50%, 0) scale(1.185) !important;
    }
    @e leave-active {
      opacity: 0;
      transform: translate3d(-50%, -50%, 0) !important;
    }
  }

  @b popup-scale {
    @e enter, leave-active {
      opacity: 0;
      transform: scale(0);
    }
  }
}

@keyframes yt-shake {
  0% {
    transform: scale(1);
  }
  33% {
    transform: scale(1.2);
  }
  66% {
    transform: scale(0.9);
  }
  100% {
    transform: scale(1);
  }
}
